/**
* @description : 关联经营户
* @descriptionDetail : 关联经营户
* @copyright : 浙江烟草
* @author : sy
* @create : 2022-12-05 16:22:35
*/
<template>
	<view class="page">
		<!-- #ifdef H5-ONLY -->
		<theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
			<view class="right-icon" @click="confirm">
				确定
			</view>
		</theme-navbar>
		<!-- #endif -->
		<!-- #ifdef H5-WECHAT || H5-EMP -->
		<fab-button :content="fContent" @fabtrigger="fabtrigger" />
		<!-- #endif -->
		<view class="content u-page">
			<u-form :error-type="errorType" class="fpad" :model="relRetailer" :label-width="240" label-position="left" ref="uForm">
				<u-form-item :required="true" label="企业名称" prop="companyName">
					<u-input type="select" input-align="right" :border="false" placeholder="请选择企业名称" v-model="relRetailer.companyName" @click="addRelRetail" />
				</u-form-item>
				<u-form-item label="经营场所地址">
					<u-input type="text" input-align="right" :disabled="true" :border="false" placeholder="根据选择的无证户/持证户信息自动写入" v-model="relRetailer.businessAddr" />
				</u-form-item>
				<u-form-item label="持证人">
					<u-input type="text" input-align="right" :disabled="true" :border="false" placeholder="根据选择的无证户/持证户信息自动写入" v-model="relRetailer.managerName" />
				</u-form-item>
				<u-form-item :required="true" label="关联关系类型" prop="relation">
					<dic-input input-align="right" :keyWord="$u.dic.DIC_KEYS.L_RELATION_TYPE" :dicCode="relRetailer.relation" :border="false" type="select" :select-open="dicSelectOpen($u.dic.DIC_KEYS.L_RELATION_TYPE)" placeholder="请选择" :disabled="true" v-model="relRetailer.relationName" @changeInputModelData="(name)=>{$set(relRetailer, 'relationName', name)}" @click="showDic($u.dic.DIC_KEYS.L_RELATION_TYPE,relRetailer.relation)" />
				</u-form-item>
				<u-form-item label-position="top" label="备注">
					<u-input type="textarea" :border="false" placeholder="请输入备注" v-model="relRetailer.relRemark" />
				</u-form-item>
			</u-form>
			<!-- 下拉选择用 -->
			<dic-choice :keyWord="dicKeyWords" :currentSelect="dicCurrentSelect" v-model="dicShow" @confirm="selectDicConfirm"></dic-choice>
		</view>
	</view>
</template>

<script>
	import DicChoice from "@/components/dic_choice.vue";
	import DicInput from "@/components/dic_input.vue";
	import queryService from "@/service/check/query.service";
	import fabButton from '@/components/uni-fab.vue';

	export default {
		components: {
			DicChoice,
			DicInput,
			fabButton
		},
		onLoad(opt) {
			let p = this.getRouteParam();
			if (p && p.relUuid) {
				this.getRelRetailer(p.relUuid, p);
			}
		},
		data() {
			return {
				errorType: ['border-bottom', "message", ],
				relRetailer: {},
				rules: {
					companyName: [{
						required: true,
						message: '请选择企业名称',
						trigger: ['blur', 'change', ],
					}, ],
					relation: [{
						required: true,
						message: '请选择关联关系类型',
						trigger: ['blur', 'change', ],
					}, ],
				},
				dicShow: false,
				// dic 关键字
				dicKeyWords: "",
				// dic 当前选择项
				dicCurrentSelect: "",
				fContent: [{
					iconPath: require('@/static/confirm.png'),
					selectedIconPath: require('@/static/confirm.png'),
					text: '确定',
					active: false,
				}],
			}
		},
		mounted() {
			this.setRightBtns();
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			setRightBtns() {
				// 设置右侧标题
				// #ifdef H5-DINGDING
				this.$deviceApi.setRight("确定", () => {
					this.confirm();
					this.setRightBtns();
				}, true, true);
				// #endif
			},
			fabtrigger(btn) {
				if (btn.index == 0) {
					this.confirm();
				}
			},
			dicSelectOpen(keyWords) {
				if (this.dicKeyWords == keyWords && this.dicShow) {
					return true;
				}
				return false;
			},
			showDic(key, cur, type) {
				if (this.dicShow) return;
				this.dicKeyWords = key;
				this.dicCurrentSelect = cur;
				this.dicShow = true;
			},
			/**
			 * @description 下拉选中确定事件，处理选中的结果绑定至数据
			 * @params e 选中的结果数据
			 */
			selectDicConfirm(e) {
				if (this.dicKeyWords == this.$u.dic.DIC_KEYS.L_RELATION_TYPE) {
					this.relRetailer.relationName = e[0].label;
					this.relRetailer.relation = e[0].extra.bcbCode;
				}
			},
			// 获取关联经营户详情
			getRelRetailer(id, relObj) {
				this.$u.loading('加载中...');
				queryService.getRelRetailer(id).then((rs) => {
					this.$u.hideLoading();
					if (rs.success) {
						this.relRetailer = rs.bean;
						this.relRetailer.retailerUuid = this.relRetailer.relRetailerUuid;
						this.objMerge(this.relRetailer, relObj);
					} else {
						this.$u.toast('查询详情失败！');
					}
				}).catch((err) => {
					this.$u.toast(err);
					this.$u.hideLoading();
				})
			},
			// 选择关联的经营户
			addRelRetail() {
				if (!this.relRetailer.relUuid) {
					this.$u.route("/pages/check/temporaryTask?taskSubject=01&isSingle=1&isRelRetailer=1&title=选择关联经营户");
				}
			},
			updateBackState(data) {
				if (data['temporaryTask']) {
					let rel = data['temporaryTask'];
					this.relRetailer = rel.length > 0 ? rel[0] : {};
				}
			},
			confirm() {
				let self = this;
				this.$refs.uForm.validate(valid => {
					if (valid) {
						let pp = {};
						for (let prop in self.relRetailer) {
							if (Object.prototype.hasOwnProperty.call(self.relRetailer, prop)) {
								pp[prop] = self.relRetailer[prop];
							}
						}
						self.backPrev({
							paramKey: "relRetailer",
							param: pp,
						});
					}
				});
			},
		},
	}
</script>

<style scoped lang="scss">
	.right-icon {
		padding: 0 25rpx;
		font-size: 30rpx;
		color: white;
	}

	.fpad {
		padding: 20rpx 30rpx;
	}
</style>
